import 'dart:io';
import 'package:deer/res/colors.dart';
import 'package:deer/res/styles.dart';
import 'package:deer/routers/fluro_navigator.dart';
import 'package:deer/store/store_router.dart';
import 'package:deer/util/utils.dart';
import 'package:deer/widgets/app_bar.dart';
import 'package:deer/widgets/highlight_well.dart';
import 'package:deer/widgets/select_text_item.dart';
import 'package:deer/widgets/selected_image.dart';
import 'package:deer/widgets/text_field_item.dart';
import 'package:flutter/material.dart';
import 'package:flutter/foundation.dart';
import 'package:flutter/painting.dart';
import 'package:image_picker/image_picker.dart';
import 'package:keyboard_actions/keyboard_actions.dart';
import 'package:oktoast/oktoast.dart';

class StoreAudit extends StatefulWidget {
  @override
  _StoreAuditState createState() => _StoreAuditState();
}

class _StoreAuditState extends State<StoreAudit> {
  File _imageFile;
  FocusNode _focusNode1 = FocusNode();
  FocusNode _focusNode2 = FocusNode();
  FocusNode _focusNode3 = FocusNode();
  FocusScopeNode _focusScopeNode = FocusScopeNode();

  Future<void> _getImage() async {
    try {
      File imageFile = await ImagePicker.pickImage(source: ImageSource.gallery);
      if (imageFile != null) {
        _imageFile = imageFile;
        setState(() {});
      }
    } catch (e) {
      showToast('没有权限，无法打开相册');
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: MyAppBar(
        centerTitle: '店铺审核资料',
      ),
      body: SafeArea(
        child: Column(
          children: <Widget>[
            Expanded(
              flex: 1,
              child: defaultTargetPlatform == TargetPlatform.iOS
                  ? FormKeyboardActions(
                      child: _buildBody(),
                    )
                  : SingleChildScrollView(
                      child: _buildBody(),
                    ),
            ),
            Padding(
              padding: const EdgeInsets.only(left: 16, right: 16, bottom: 8),
              child: Container(
                width: double.infinity,
                height: 44,
                child: FlatButton(
                  textColor: Colors.white,
                  color: Colours.app_main,
                  shape: RoundedRectangleBorder(
                      borderRadius: BorderRadius.circular(3)),
                  child: Text(
                    '提交',
                    style: TextStyle(fontSize: 18),
                  ),
                  onPressed: () {
                    NavigatorUtils.push(context, StoreRouter.auditResultPage);
                  },
                ),
              ),
            )
          ],
        ),
      ),
    );
  }

  _buildBody() {
    return GestureDetector(
      onTap: () {
        if (_focusScopeNode == null) {
          _focusScopeNode = FocusScope.of(context);
        }
        _focusNode1.unfocus();
        _focusNode2.unfocus();
        _focusNode3.unfocus();
      },
      child: Container(
        color: Colors.white,
        child: Padding(
          padding: const EdgeInsets.only(top: 21, bottom: 10),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: <Widget>[
              const Padding(
                padding: const EdgeInsets.only(left: 16),
                child: Text(
                  '店铺资料',
                  style: TextStyles.textBoldDark18,
                ),
              ),
              Gaps.vGap(16),
              Center(
                child: SelectedImage(
                  image: _imageFile,
                  onTap: _getImage,
                ),
              ),
              Gaps.vGap(8),
              Center(
                child: Text(
                  '店主手持身份证或营业执照',
                  style: TextStyles.textGray14,
                ),
              ),
              Gaps.vGap(16),
              TextFieldItem(
                title: '店铺名称',
                hintText: '填写店铺名称',
                focusNode: _focusNode1,
              ),
              SelectTextItem(
                title: '主营范围',
                content: _sortName,
                onTap: () {
                  _showBottomSheet();
                },
              ),
              SelectTextItem(
                title: '店铺地址',
                onTap: () {
                  
                },
              ),
              const Padding(
                padding: const EdgeInsets.only(left: 16, top: 33),
                child: Text(
                  '店主信息',
                  style: TextStyles.textBoldDark18,
                ),
              ),
              Gaps.vGap(16),
              TextFieldItem(
                title: '店主姓名',
                hintText: '填写店主姓名',
                focusNode: _focusNode2,
              ),
              TextFieldItem(
                title: '联系电话',
                hintText: '填写店主联系电话',
                keyboardType: TextInputType.phone,
                focusNode: _focusNode3,
                config: Utils.getKeyboardActionsConfig(
                    [_focusNode1, _focusNode2, _focusNode3]),
              )
            ],
          ),
        ),
      ),
    );
  }

  String _sortName = "";
  var _list = [
    "水果生鲜",
    "家用电器",
    "休闲食品",
    "茶酒饮料",
    "美妆个护",
    "粮油调味",
    "家庭清洁",
    "厨具用品",
    "儿童玩具",
    "床上用品"
  ];

  _showBottomSheet() {
    showModalBottomSheet(
      context: context,
      builder: (BuildContext context) {
        return Container(
          height: 360,
          child: ListView.builder(
            itemCount: _list.length,
            itemBuilder: (_, index) {
              return HighLightWell(
                onTap: () {
                  setState(() {
                    _sortName = _list[index];
                  });
                  NavigatorUtils.goBack(context);
                },
                child: Container(
                  padding: const EdgeInsets.symmetric(horizontal: 16),
                  height: 48,
                  alignment: Alignment.centerLeft,
                  child: Text(_list[index]),
                ),
              );
            },
          ),
        );
      }
    );
  }

}
